<template>
  <div class="bgcolor">
        <city-header></city-header>
        <city-list :citylist="citylist"></city-list>
  </div>
</template>

<script>
import CityHeader from './pages/Header.vue'
import CityList from './pages/List.vue'
export default {
    components:{
        CityHeader,
        CityList
    },
    data(){
        return{
            citylist:[]
        }
    },
    created(){
        this.getdata()
    },
    methods:{
        async getdata(){
           const {data :res} = await this.$http.get('./js/city.json')
           this.citylist =res.data
        }
    }
}
</script>

<style scoped>
.bgcolor{
    background-color: #f5f5f5;
}
</style>